<template>
  <div>
    <div class="swiper-slide" v-if="dataList.length">
      <mt-swipe :auto="3000" @change="handleChange">
        <mt-swipe-item v-for="data in dataList" :key="data.bannerId">
          <a :href="data.imgUrl">
            <img :src="data.imgUrl" style="width: 100%"/>
          </a>
        </mt-swipe-item>
      </mt-swipe>
    </div>

    <mt-button type="default">default</mt-button>
    <mt-button type="primary">primary</mt-button>
    <mt-button type="danger" size="large" @click="sheetVisible = !sheetVisible">danger</mt-button>

    <mt-actionsheet
      :actions="actions"
      v-model="sheetVisible">
    </mt-actionsheet>
  </div>
</template>

<script>
import { Indicator } from 'mint-ui'
import axios from 'axios'

const user = {
  isLogin () {
    return true
  }
}

export default {
  name: 'Center',
  data () {
    return {
      dataList: [],
      actions: [
        {
          name: '拍照',
          method: () => {
            console.log('拍照')
          }
        },
        {
          name: '相册',
          method: () => {
            console.log('相册')
          }
        }
      ],
      sheetVisible: false
    }
  },
  mounted () {
    Indicator.open({
      text: '加载中...',
      spinnerType: 'fading-circle'
    })
    axios({
      url: 'https://m.maizuo.com/gateway?type=2&cityId=440300&k=2040388',
      headers: {
        'X-Client-Info': '{"a":"3000","ch":"1002","v":"5.0.4","e":"16318468911969714951618561"}',
        'X-Host': 'mall.cfg.common-banner'
      }
    }).then(res => {
      console.log(res.data)
      this.dataList = res.data.data
      // 关闭loading
      Indicator.close()
    })
  },
  methods: {
    handleChange (index) {
      console.log('index=', index)
    }
  },
  // 局部路由守卫(拦截)
  beforeRouteEnter (to, from, next) {
    if (to.path === '/center') {
      if (user.isLogin()) {
        next()
      } else {
        next('/login')
      }
    } else {
      next() // 不拦截 继续
    }
  }
}
</script>

<style scoped lang="scss">
.swiper-slide {
  height: 200px;
}

</style>
